import React, { lazy, Suspense } from 'react';
import zhCN from 'antd/es/locale/zh_CN';
import { ConfigProvider } from 'antd'; // 国际化全局配置，都换成中文
import Main from '@pages/main';

const PreviousFonc = lazy(() => import('@pages/messageBoard/previousFonc'));
const PreviousFoncEdit = lazy(() => import('@pages/messageBoard/previousFonc/previousFoncEdit'));
const UnderDevelopment = lazy(() => import('@pages/messageBoard/underDevelopment'));
const DevelopmentEdit = lazy(() => import('@pages/messageBoard/underDevelopment/developmentEdit'));
const AuditingLeave = lazy(() => import('@pages/messageBoard/auditingLeave'));
const Login = lazy(() => import('@pages/login'));

const lazySuspense = (Component) => {
  return <Suspense fallback={<div>loading...</div>}>
          <ConfigProvider locale={zhCN}>
            <Component />
          </ConfigProvider>
      </Suspense>
}

const ele = [
  {
    path: '/',
    element: lazySuspense(Main),
    children: [
      {
        path: 'message-board',
        children: [
          {
            path: 'previous-fonc',
            children: [
              {
                path: '',
                element: lazySuspense(PreviousFonc)
              },
              {
                path: 'edit',
                element: lazySuspense(PreviousFoncEdit)
              }
            ]
          },
          {
            path: 'under-development',
            children: [
              {
                path: '',
                element: lazySuspense(UnderDevelopment)
              },
              {
                path: 'edit',
                element: lazySuspense(DevelopmentEdit)
              }
            ]
          },
          {
            path: 'auditing-leave',
            element: lazySuspense(AuditingLeave)
          }
        ]
      },
    ]
  },
  {
    path: 'login',
    element: lazySuspense(Login)
  },
  {
    path: '*',
    element: <div>404</div>
  }
];

export default ele;